<template>
  <div class="digitalAlbum">
    <div class="item-contain a" v-for="(item,index) in AlbumData" :key="index">
      <AlbumItem :data="item"></AlbumItem>
    </div>
  </div>
</template>

<script>
import AlbumItem from '../AlbumItem'
import AlbumData from '@/data/home/DigitalAlbum.js'
export default {
    name:"DigitalAlbum",
    components: {
        AlbumItem
    },setup(){
        return {
            AlbumData
        }
    }
}
</script>

<style lang="scss">
.digitalAlbum {
  .thumb {
    padding-bottom: 25px;
    padding-right: 25px;
  }
  .item-contain {
    width: 20%;
    float: left;
    overflow: hidden;
  }

  .item-box {
    i {
      background-image: url("../../../assets/images/home/album-cover-gold.png") !important;
    }
    &::before {
      content: "数字专辑";
      position: absolute;
      top: 4px;
      right: 4px;
      padding: 2px 8px;
      border-radius: 2px 6px;
      color: #fff;
      background: rgba(255, 201, 117, 0.9);
      z-index: 2;
    }
  }
}
</style>